<template>
  <div class="home_index">
      <div class="bottom-icon bottom-noposition">
        <a target="_blank" href="https://t.me/newbest_Asia">
          <img src="../../assets/bottom-icon-telegram.png" alt="">
        </a>
        <a target="_blank" href="https://twitter.com/NewBestAsia1">
          <img src="../../assets/bottom-icon-twitter.png" alt="">
        </a>
        <a target="_blank" href="https://medium.com/@nbcfancs">
          <img src="../../assets/bottom-icon-medium.png" alt="">
        </a>
      </div>
  </div>
</template>

<script>
  
export default {
  name: 'homeFooter',
  data () {
    return {
    }
  },
  mounted(){
  },
  methods: {
  },
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less">  
  .colorFEDD4F{
    color: #FEDD4F;
  }
  @media only screen and (min-width: 0px) and (max-width: 639px){
    .top670{
      top: 670px;
      margin-bottom: 40px; 
    }
    .home_index{
      width: 100%;
      z-index: 10;
      .bottom-icon{
        width: 100px;
        height: 20px;
        left: calc(50% - 50px);
        position: absolute;
        display: flex;
        justify-content: space-around;
        bottom: 87px;
        img{
          width: 20px;
        }
      }
      .bottom-noposition{
        position: initial;
        margin: 0 auto;
        margin-bottom: 87px;
        margin-top: 80px;
      }
    }
  }
  @media only screen and (min-width: 639px){
    .top670{
      top: 860px;
      margin-bottom: 40px; 
    }
    .home_index{
      width: 1200px;
      margin:0 auto;
      .bottom-icon{
        width: 100px;
        height: 20px;
        left: calc(50% - 50px);
        position: absolute;
        display: flex;
        justify-content: space-around;
        bottom: 87px;
        img{
          width: 20px;
        }
      }
      .bottom-noposition{
        position: initial;
        margin: 0 auto;
        margin-bottom: 87px;
        margin-top: 80px;
      }
    }
  }
</style>
